<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0,
		 maximum-scale=1.0, minimum-scale=1.0,<!-- shrink-to-fit=no -->" />
		<title>项目主页</title>
		<link rel="stylesheet" href="css/normalize.css">
		<link rel="stylesheet" href="css/index.css">
		<link rel="stylesheet" href="css/normalize.css">
		<link rel="stylesheet" href="css/register.css">
		<script src="js/echarts.min.js"></script>
		<script src="js/clipboard.min.js"></script>
		<script src="js/clipboard.js"></script>
		<script src="js/jquery-3.5.1.min.js"></script>
		<script src="js/jquery-3.5.1.js"></script>
		<script src="https://cdn.jsdelivr.net/gh/ethereum/web3.js/dist/web3.min.js"></script>
		<script src="js/tp.js"></script>
	</head>
	<body style="overflow-x: hidden;">
		<!-- 头部 -->
		<div class="w">
		<div class="header">
			<div class="logo">
				<h1><a href="#">GABRIEL</a></h1>
			</div>
			<div class="header_text">
				<button onclick="OpenWallet()" id='header_text'>Connect to a wallet</button>
			</div>
			<div class="wenzi">
				<button>
					<p>文</p>
				<span>A</span>
				</button>
			</div>
		</div>


		<!-- 文字 -->
		<div class="text">
			<p>THE NEW CURRENCY FOR <span class="style_Y">THE NEXT GENERATION</span></p>
			<h1>ln Just A Few Taps,</h1>
			<h2 class="style_Y">YOU CAN BUY</h2>
		</div>

		<!-- 盒子 -->
		<div class="box">
			<div class="box-hd">
				<h2>INVITATION ONLY PRIVATE TOKEN SALE</h2>
				<i><img src="./img/iov-info%20(1).png" alt="" style="width: 20px;"></i>
				<div class="line_1"></div>
				<div class="line_2"></div>
				<div class="sanjiao"></div>
				<div class="box-bd">
					<ul>
						<li>
							<span>00</span>
							<p style="padding-left: 21px">DAYS</p>
							<div class="dian_1"></div>
							<div class="dian_2"></div>
						</li>
						<li>
							<span>00</span>
							<p>HOURS</p>
							<div class="dian_1"></div>
							<div class="dian_2"></div>
						</li>
						<li>
							<span>00</span>
							<p>MINUTES</p>
							<div class="dian_1"></div>
							<div class="dian_2"></div>
						</li>
						<li>
							<span>00</span>
							<p>SECONDS</p>

						</li>
					</ul>
				</div>
				 <div class="table_box">
				<table>
					<tr>
						<th>NO.1 IDO,</th>
						<th>0.1BNB=100000000 </th>
						<!---th>0.1BNB=1000Coin</th--->
					</tr>
					<tr>
						<td>NO.2 IDO,</td>
						<td>0.1BNB=70000000 </td>
						<!---td>0.1BNB=700Coin</td--->
					</tr>
					<tr>
						<td>NO.3 IDO,</td>
						<td> 0.1BNB=50000000</td>
						<!---td>0.1BNB=500Coin</td--->
					</tr>
				</table>
				</div>
				<div class="juxing">
					<div class="xiaojuxing">
						
					</div>
					<p class="style_Y">25%</p>
				</div>
			</div>
			<div class="box_bd">
				<ul>
					<li><button onclick="BtnBuyToken()">Buy  <span style="color: #FEBC06;">Token</button></span></li>
					<li><button onclick="BtnReferrals()">Referrals</button></li>
				</ul>
				
			</div>
		</div>
		<!-- main部分 -->
		<div class="main clearfix">
			<div class="main_hd">
				<h2>Gabriel TOKEN</h2>
				<div id="main_pie" class="pie" style="width: 300px;height:400px; margin-left: 40px;">
				</div>
				<div class="content">
					<p>Token Tatal issue: 1,000,000,000,000</p>
					<p>Transaction fee:10%</p>
					<p>(5% Destruction and 5%Whole network dividend)</p>
				</div>

				<div class="num">
					<ul>
						<li>
							<p class="style_r">Token Destruction</p>
							<p><strong>50.00%</strong> &nbsp;Black Hole</p>
						</li>
						<li>
							<p class="style_r">Token Sale</p>
							<p><strong>10.00%</strong> &nbsp;IDO NO.1</p>
						</li>
						<li>
							<p class="style_r">Token Sale</p>
							<p><strong>10.00%</strong> &nbsp;IDO NO.2</p>
						</li>
						<li>
							<p class="style_r">Token Sale</p>
							<p><strong>10.00%</strong> &nbsp;IDO NO.3</p>
						</li>
						<li>
							<p class="style_r">Liquidity Pool</p>
							<p><strong>10.00%</strong> &nbsp;Liquidity Pool</p>
						</li>
						<li>
							<p class="style_r">Airdrop</p>
							<p><strong>10.00%</strong> &nbsp;Airdrop</p>
						</li>

					</ul>
					<div class="box-1"></div>
					<div class="box-2"></div>
					<div class="text_r">
						Purchase limit:0.1BNB-10BNB
					</div>
				</div>

				<div class="date">
					<ul>
						<li>
							<p>START DATE</p>
							<h4>JUNE 12/21 9AM</h4>
						</li>
						<li>
							<p>END DATE</p>
							<h4>JUNE 16/21 9AM</h4>
						</li>
						<li>
							<p>TOKEN SYMBOL</p>
							<h4>GABRIEL</h4>
						</li>
						<li>
							<p>SALE TOKENS</p>
							<h4>300000000000</h4>
							<h6 style="padding-left: 15px;">(GABRIEL)</h6>
						</li>
					</ul>
					<div class="box_t_l_z"></div>
					<div class="box_t_r_z"></div>
					<div class="box_t_l_r"></div>
					<div class="box_t_r_r"></div>
				</div>
			</div>
			<div class="nav">
				<h2>WHAT IS GABRLEL?</h2>
				<ul>
					<li>
						<div class="pic">
							<img src="./img/xiaotu1.png" alt="">
						</div>
						<h3>Decentraliazed Aggregated Oracle</h3>
						<p>Fully trustless and decentralized off-chain data,on chain</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/xiaotu2.png" alt="">
						</div>
						<h3>On-Demand Oracle Data</h3>
						<p>P2P incentivized network to obtain atypical off-chain data</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/xiaotu3.png" alt="">
						</div>
						<h3>Oracle Marketplace</h3>
						<p>A secure trustless market for oracle data clients and providers</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/xiaotu4.png" alt="">
						</div>
						<h3>Modular Dashboard</h3>
						<p>Fully Gabriel, scalable dashboard for every tool in the crypto space</p>
					</li>
				</ul>
			</div>

			<div class="text_con">
				<div class="text_con_hd">
					<ul>
						<li class="style_pink">
							<p>DECENTRALIZED</p>
							<p>AGGREGATED</p>
							<p>ORACLE</p>
						</li>
						<li>
							<p>ON-DEMAND</p>
							<P>ORACLE</P>
						</li>
					</ul>
				</div>
				<div class="text_con_bd">
					<p>
						Gabriel coin will provide <br>
						the first truly trustless and<br>
						decentralize oracle data. <br>
						Outliers, malicious actors, <br>
						and corrupt data is removed<br>
						autonomously with no <br>
						outside interaction through <br>
						the use of smart contracts <br>
						and multiple data sources.
					</p>
				</div>
			</div>
			<!-- 错误 -->
			<div class="nav">
				<h2>THE ORACLE PROBLEM</h2>
				<ul>
					<li>
						<div class="pic">
							<img src="./img/f.png" alt="" style="width: 154px;margin-left: -12px;">
						</div>
						<h3>Centralized Oracles</h3>
						<p>Consensus is resched within its own proprietary network</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/f.png" alt="" style="width: 154px;margin-left: -12px;">
						</div>
						<h3>Layer 1 Limitations</h3>
						<p>Slow and costly execution,reducing reliability/throughput</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/f.png" alt="" style="width: 154px;margin-left: -12px;">
						</div>
						<h3>One-way Data</h3>
						<p>Restricting inputs from outside sources</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/f.png" alt="" style="width: 154px;margin-left: -12px;">
						</div>
						<h3>Developers Only</h3>
						<p>Oracle data requests require deep knowledge to implement</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/f.png" alt="" style="width: 154px;margin-left: -12px;">
						</div>
						<h3>The Monopoly</h3>
						<p>Popular network control a large majority of the output data</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/f.png" alt="" style="width: 154px;margin-left: -12px;">
						</div>
						<h3>Manipulation/Exploits</h3>
						<p>Data manipulation is easier within a single oracle network</p>
					</li>
				</ul>
			</div>

			<!-- 正确 -->
			<div class="nav">
				<h2>OUR SOLUTION</h2>
				<ul>
					<li>
						<div class="pic">
							<img src="./img/t.png" alt="" style="width: 140px;">
						</div>
						<h3>Multiple Oracle Networks</h3>
						<p>Utilizing trusted data from established oracles networks</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/t.png" alt="" style="width: 140px;">
						</div>
						<h3>Layer 2 Solutions</h3>
						<p>Output secure data at lower costs and higher frequency</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/t.png" alt="" style="width: 140px;">
						</div>
						<h3>Bi-Directional Cross-chain</h3>
						<p>Redundant fail safe oracle data via interoperability</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/t.png" alt="" style="width: 140px;">
						</div>
						<h3>Oracle Marketplace</h3>
						<p>Request, supply and trade data with reputable providers</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/t.png" alt="" style="width: 140px;">
						</div>
						<h3>Multiple Blockchains</h3>
						<p>lncreasing scalability, compatibility and security</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/t.png" alt="" style="width: 140px;">
						</div>
						<h3>Autonomous Execution</h3>
						<p>Corrupt and malicious data removed autonomously</p>
					</li>

					<!-- 综合 -->

					<li>
						<div class="pic">
							<img src="./img/xiaotutu1.png" alt="" style="width: 140px;">
						</div>
						<h3>Governance Voting</h3>
						<p>Ecosystem changes are voted in by token holders</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/xiaotutu2.png" alt="" style="width: 170px; margin-left: -16px;">
						</div>
						<h3>Liquidity Mining</h3>
						<p>Acquire by providing liquidity to the market</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/xiaotutu3.png" alt="" style="width: 170px; margin-left: -16px;">
						</div>
						<h3>Oracle Validation</h3>
						<p>Acquire by providing validation to the network</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/xiaotutu4.png" alt="" style="width: 170px; margin-left: -16px;">
						</div>
						<h3>Community Driven</h3>
						<p>Decisions are voted in instead of pushed by management</p>
					</li>
					<li>
						<div class="pic">
							<img src="./img/xiaotutu5.png" alt="" style="width: 170px; margin-left: -16px;">
						</div>
						<h3>Decentralized Platform</h3>
						<p>Governance DAO brings true decentralization</p>
					</li>
				</ul>
			</div>

			<div class="man">
				<h2>Core Team</h2>
				<ul>
					<li>
						<div class="pic_man">
							<img src="./img/man.png" alt="" style="margin-top: -20px; margin-left: -11px; width: 95px;">
						</div>
						<h3>Ryan Lowe</h3>
						<h4>Chief Executive Officer</h4>
						<p>Blockchain advocate since 2017 wit
							18 years of business management
							experience.</p>
					</li>
					<li>
						<div class="pic_man">
							<img src="./img/man.png" alt="" style="margin-top: -20px; margin-left: -11px; width: 95px;">
						</div>
						<h3>Trevor Hall</h3>
						<h4>Chief Operations Officer</h4>
						<p>Blockchain advocate since 2016 with
							9 years of business growth and
							development experience.</p>
					</li>
					<li>
						<div class="pic_man">
							<img src="./img/man.png" alt="" style="margin-top: -20px; margin-left: -11px; width: 95px;">
						</div>
						<h3>Jesse Ireland</h3>
						<h4>Chief Technical Officer</h4>
						<p>Mathematician turned software
							developer with two degrees and 6
							years programming experience.</p>
					</li>
					<li>
						<div class="pic_man">
							<img src="./img/man.png" alt="" style="margin-top: -20px; margin-left: -11px; width: 95px;">
						</div>
						<h3>Uosof Ahmadi</h3>
						<h4>Chief Marketing Officer</h4>
						<p>Marketing powerhouse, propelling
							over 30 global brands to market with
							8 years experience.</p>
					</li>
					<li style="margin-left: 35px;">
						<div class="pic_man">
							<img src="./img/man.png" alt="" style="margin-top: -20px; margin-left: -11px; width: 95px;">
						</div>
						<h3>Michael Liddiard</h3>
						<h4>Chief Legal Officer</h4>
						<p>Michael is the President of Liddiard
							Law which focuses on Corporate and
							Fintech Law.</p>
					</li>
				</ul>
			</div>

			<div class="date_year">
				<h3>ROADMAP</h3>
				<div class="year">
					<div class="year_yuan">
						<div class="year_yuan_xiao">

						</div>
					</div>
					<ul>
						<li>2020 Q2</li>
						<li>Concept</li>
						<li>Idea / Project Conception</li>
						<li>
							<div class="line"></div>Product Research
						</li>
					</ul>
				</div>

				<div class="year" style="height: 300px;">
					<div class="year_yuan">
						<div class="year_yuan_xiao">

						</div>
					</div>
					<ul>
						<li>2020 Q3</li>
						<li>Research</li>
						<li>Proving Concept Viability</li>
						<li>
							<div class="line"></div>Strtegic Plan
						</li>
						<li>
							<div class="line"></div>Partner / Marketing Outreach
						</li>
						<li>
							<div class="line"></div>Team Building
						</li>
					</ul>
				</div>


				<div class="year" style="height: 390px;">
					<div class="year_yuan">
						<div class="year_yuan_xiao">

						</div>
					</div>
					<ul>
						<li>2020 Q4</li>
						<li>Public Launch</li>
						<li>Project Launched to Public</li>
						<li>
							<div class="line"></div>Website Completed
						</li>
						<li>
							<div class="line"></div>Pitch Deck Completed
						</li>
						<li>
							<div class="line"></div>Partnerships
						</li>
						<li>
							<div class="line"></div>Marketing-Phase 1
						</li>
					</ul>
				</div>

				<div class="year b_left" style="height: 390px;">
					<div class="year_yuan" style="    margin-top: -17px; margin-left: -12px;">
						<div class="year_yuan_xiao">

						</div>
					</div>
					<ul>
						<li>2021 Q1</li>
						<li>Product Development / Token Launch</li>
						<li>Token Sale</li>
						<li>
							<div class="line"></div>Decentralized Aggregated Oracle Bet Release
						</li>
						<li>
							<div class="line"></div>Oracle Onboarding
						</li>
						<li>
							<div class="line"></div>User Onboarding
						</li>
						<li>
							<div class="line"></div>Staking
						</li>
						<li>
							<div class="line"></div>Liquidity Generation Event
						</li>
						<li>
							<div class="line"></div>Marketing - Phase 2
						</li>
					</ul>
				</div>

				<div class="year b_left" style="height: 410px;">
					<div class="year_yuan" style="margin-top: -23px; background-color: transparent;">
						<div class="year_yuan_xiao " style=" margin-left: 7px;">

						</div>
					</div>
					<ul>
						<li>2021 Q2</li>
						<li>Full Suite Beta Launch</li>
						<li>Decentralized Aggregated Oracle Public Release</li>
						<li>
							<div class="line"></div>On-Demand Oracle Beta V1 / V2 Release
						</li>
						<li>
							<div class="line"></div>Validator Onboarding
						</li>
						<li>
							<div class="line"></div>Oracle Marketplace Beta Release
						</li>
						<li>
							<div class="line"></div>DeFi Dashboard Design / Demo
						</li>
						<li>
							<div class="line"></div>MOD Governance
						</li>
						<li>
							<div class="line"></div>Partnerships
						</li>
						<li>
							<div class="line"></div>Marketing - Phase 3
						</li>
					</ul>
				</div>


				<div class="year b_left" style="height: 200px;">
					<div class="year_yuan" style="margin-top: -23px; background-color: transparent;">
						<div class="year_yuan_xiao" style=" margin-left: 7px;">

						</div>
					</div>
					<ul>
						<li>2021 Q3</li>
						<li>Scaling & Optimization</li>
						<li>Pushing the platform for full adoption</li>

					</ul>
				</div>


				<div class="year b_left" style="height: 200px;">
					<div class="year_yuan" style="margin-top: -23px; background-color: transparent;">
						<div class="year_yuan_xiao" style=" margin-left: 7px;">

						</div>
					</div>
					<ul>
						<li>2021 Q3</li>
						<li>Whole network public offering </li>
						<li>Officially launched </li>
						<li>PancakeSwap, Bilaxy,gate.io</li>

					</ul>
				</div>

				<div class="year b_left" style="height: 200px;">
					<div class="year_yuan" style="margin-top: -23px; background-color: transparent;">
						<div class="year_yuan_xiao" style=" margin-left: 7px;">

						</div>
					</div>
					<ul>
						<li>2021 Q3</li>
						<li>Bridges / Interoperability </li>
						<li>Building the connections across</li>
						<li>multiple chains</li>

					</ul>
				</div>

				<div class="year b_left" style="height: 130px;">
					<div class="year_yuan" style="margin-top: -23px; background-color: transparent;">
						<div class="year_yuan_xiao" style="margin-top: 70px; margin-left: 7px;">

						</div>
					</div>
					<ul>
						<li style="height: 35px;">2021 Q4</li>
						<li>Resilient,autonomous organizations</li>
						<li style="height: 15px; line-height: 15px;">Empower your community to organize and </li>
						<li>allocate resourcesc</li>
						<li style="height: 15px; line-height: 15px;">to its members. Vote on impactful gover-</li>
						<li>nance decisions</li>

					</ul>
				</div>
			</div>
		</div>
		<!-- main 部分 end -->

		<!-- footer 盒子部分 -->
		<div id="divReferrals" class="footer_box">
			<h1>Referrals</h1>
			<div class="footer_top_box">
				<h2>Referrals Link:</h2>
				<div class="box_top">
					<input type="text" name="" id="txtcopy">
					<div class="copy">
					<button id='btnCopy' data-clipboard-target="#txtcopy" onclick="BtnCopy()">SUBMIT</button>
				</div>
				</div>
				
				<h3>You need 100K Gabriel to activate.</h3>
			</div>
			<div class="footer_bottom_box">
				<h3>Cumulative invitation revenue:</h3> <span>BNB</span>
				<div class="box_left">
					<button>
						<h2>First level</h2>
					</button>
				</div>
				<ul>
					<li></li>
					<li></li>
					<li></li>
				</ul>
				<div class="box_right">
					<button>
						<h2>Second level</h2>
					</button>
				</div>
				<div class="text_box">
					<div class="box_left_text">
						<h3>10%Invitation revenue</h3>
						<h4>Referrals:</h4>
						<h5>Total investment:</h5>
						<h6><label id='first'>0</label>BNB</h6>
					</div>
					<div class="box_right_text">
						<h3>5%Invitation revenue</h3>
						<h4>Referrals</h4>
						<h5>Total investment:</h5>
						<h6><label id='second'>0</label>BNB</h6>
					</div>
				</div>
			</div>
		</div>
		<!-- footer 盒子部分 end -->

		<!-- footer_brand底部 部分 -->
		<div class="footer_brand">
			<div class="pic_1">
				<img src="img/ditutu.png" alt="" width="100%">
			</div>
		</div>
		<div class="footer_brand_logo">
			<ul>
				<li><a href="https://twitter.com/Gabriel88728890"><img src="img/weichi.png" alt=""></a></li>
				<li><a href="https://t.me/Gabriel2021cn"><img src="img/dianbao.png" alt=""></a></li>
				<li><a href="#"><img src="img/gu.png" alt=""></a></li>
				<li><a href="#"><img src="img/baiwei.png" alt=""></a></li>
			</ul>
		</div>
		<script src="js/index.js?ver=3"></script>

		<!-- 页面弹框 -->
		<div id="myModal" class="modal">
			<div class="modal-content">
				<div class="modal-header">
					
					<!-- <h2>弹窗头部</h2> -->
				</div>
				<div class="modal-body">
					<div class="header_box" >
						<span class="close" style="display: none;" onclick="closeClick()">&times;</span>
						<div class="header_box_big">
							<div class="header_box_hd">
								<h1>GABRIEL 0.1BNB/GRL</h1>
								<div class="header_top_box">
									<img src="img/tubiao.png" alt="" width="35" >
									<p>Global community construction to<br> protect the interestr of users</p>
								</div>
							</div>
							<div class="header_box_bd">
								<h3>Please enter Gabriel</h3>
								<input type="text" name="" id="buyMoney">
								<button class="btn_top">VALUEE&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; BNB</button>
								<h3 style="margin-top: 20px; margin-bottom: 15px;">Number Of BNB Tokens Required</h3>
								<button class="btn_bot">GABRIEL</button>
								<h3>Resl-time price 1000 GABRIEL=0.1 BNB</h3>
							</div>
							<div class="box_bd2">
								<button onclick="closeClick()">COLSE</button>
								<button style="margin-left: 10px; color: #FEBC06;" onclick="BtnBuy()">BUY</button>
							</div>
						</div>
					</div>
				</div>
				<div class="modal-footer">
					<!-- <h3>弹窗底部</h3> -->
				</div>
			</div>
		</div>
	</div>	
	</body>
</html>
